@import "../../../theme/prpColor.less";

@mainBgColor: #fff;

.menuControl {
    .firstMenu {
        position          : relative;
        background-color  : @menuBgColor;
        color             : #fff;
        height            : 100%;
        -ms-overflow-style: none;
        overflow-y        : auto;
        overflow          : '-moz-scrollbars-none';
        scrollbar-width   : none;
        width             : 70px;

        .item {
            text-align: center;
            cursor    : pointer;
            padding   : 15px 0;

            .title {
                font-size: 12px;
            }
        }

        .active {
            background-color  : @menuActiveColor;
            //border-left     : 3px solid #fff;
        }
    }

    .subMenu {
        position          : absolute;
        width             : 0;
        top               : 0;
        left              : 70px;
        z-index           : 1500;
        height            : 100%;
        overflow-y        : hidden;
        transition        : all .5s;
        -moz-transition   : all .5s;
        /* Firefox 4 */
        -webkit-transition: all .5s;
        /* Safari 和 Chrome */
        -o-transition     : all .5s;
        /* Opera */
        display           : block;
    }


    &:hover {
        .subMenu {
            width     : 280px;
            box-shadow: 0px 3px 6px fade(#000, 16%);
        }
    }

    .firstMenu::-webkit-scrollbar {
        display: none;
        width  : 0;
    }
}

.menusBox {
  position  : relative;
  background: @mainBgColor;
  height    : 100%;

  .first {
    width           : 60px;
    height          : calc(100%);
    background-color: #323348;
    float           : left;
  }

  .menusBoxList {
    position            : relative;
    width               : 100%;
    //height            : calc(100% - 64px);
    height              : calc(100%);
    overflow-y          : auto;
    -ms-overflow-style  : none;
    overflow            : '-moz-scrollbars-none';
    scrollbar-width     : none;
    //box-shadow          : 0px 3px 6px rgba(0, 0, 0, 0.16);

    :global(.ant-menu-inline) {
      height: 100%;
    }

    :global(.ant-menu-sub.ant-menu-inline) {
      background-color: #f5f7f9;

      a {
        color: #97A3B9;
      }
    }

    :global(.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected) {
      background-color: #0096dd;

      a {
        color: #fff;
      }

    }
  }

  .menusBoxList::-webkit-scrollbar {
    display: none;
    width  : 0 !important;
  }
}